/*
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
*/
 /* reset */
headerUp,wrapUp,menuUp{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
headerUp, menuUp {display: block;}
.menuUp ol,ul{list-style:none;margin:0;padding:0;}

/* start editing from here */
a{text-decoration:none;}
.txt-rt{text-align:right;}/* text align right */
.txt-lt{text-align:left;}/* text align left */
.txt-center{text-align:center;}/* text align center */
.float-rt{float:right;}/* float right */
.float-lt{float:left;}/* float left */
.clear{clear:both;}/* clear float */
.pos-relative{position:relative;}/* Position Relative */
.pos-absolute{position:absolute;}/* Position Absolute */
.vertical-base{	vertical-align:baseline;}/* vertical align baseline */
.vertical-top{	vertical-align:top;}/* vertical align top */
.underline{	padding-bottom:5px;	border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
img{max-width:100%;}
/*end reset*/
@font-face {
      font-family: 'ambleregular';
      src: url(../fonts/Amble-Regular-webfont.ttf) format('truetype');
}

.wrapUp{
	width:970px;
	margin:0 auto;
	transition:all .2s linear;
	-moz-transition:all .2s linear;/* firefox */
	-webkit-transition:all .2s linear; /* safari and chrome */
	-o-transition:all .2s linear; /* opera */
	-ms-transition:all .2s linear;
}
.headerUp{
	background:#ffffff;
}

.menuUp{
	float:right;
}
.menuUp li{
	float:left;
		padding:5px 10px;
		
}
.menuUp li a{
	display:block;
	font-family: 'ambleregular';
	font-size:0.25em;
	
	text-transform:uppercase;

	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
	position:relative;
}
.menuUp li a:hover,.menuUp li.active a{
	
	background:#F8F7FC;
}

/**** Responsice Layout *****/
@media only screen and (max-width: 1366px) and (min-width: 1280px) {
	.wrapUp{
		width:970px;
	}
}
@media only screen and (max-width: 1280px) and (min-width: 1024px) {
	.wrapUp{
		width:970px;
	}
}
@media all and (max-width: 1024px) {
	.wrapUp {
		width:970px;
	}
}
@media all and (max-width:800px) {
	.wrapUp {
		width:95%;
	}

	.menuUp li a{
		font-size:0.75em;
		padding:25px 10px;
	}
	
}
@media all and (max-width:640px) {
	.wrapUp{
		width:95%;
	}

	.menuUp li a{
		padding:25px 5px;
	}

}
@media all and (max-width:480px) {
	.wrapUp{
		width:95%;
	}

	.menuUp{
		float:none;
	}
	.menuUp li a{
		padding:10px 18px;
	}
	
 }
@media all and (max-width:320px) {
	.wrapUp{
		width:95%;
	}
	.menuUp li a {
		font-size:0.7em;
		padding: 6px 4.2px;
	}
}
